<html>
  <head>
    <title></title>
    <style>
      
      div.file-drop-zone {
        prototype: FileDropZone;
        size:200px;
        color: gray;
        border: 4px dashed;
        vertical-align:middle;
        text-align:center;
      }
      div.file-drop-zone.active-target {
        background:gold;
      }
      
    </style>
    <script type="text/tiscript">
    
    class FileDropZone : Element 
    {
      event dragenter (evt) 
      {
        if(evt.draggingDataType == #file)
        {
          this.attributes.addClass("active-target");
          return true;
        }
      }  

      event dragleave (evt) 
      {
        this.attributes.removeClass("active-target");
        return true;
      }  

      event drag (evt) 
      {
        if(evt.draggingDataType == #file)
        {
          stdout.println(evt.x,evt.y);
          return true;
        }
      }  

      event drop (evt) 
      {
        if(evt.draggingDataType == #file)
        {
          this.attributes.removeClass("active-target");
          var fn = evt.dragging;
          view.msgbox(#information, String.printf("Dropped:%V",fn));
          return true;
        }
      }  
      
    }
    
    </script>
  </head>
<body>

  <h2>IDropTarget demo, D&amp;D files from Windows Shell to DOM elements</h2> 

  <div.file-drop-zone>
    Drop your files here
  </div>

</body>
</html>
